<template>
    <div style="display: flex;">
        <div class="left">

            <div class="left-menu">
                <mymenu></mymenu>
            </div>
        </div>
        <div class="main">
           
                <div>
                    <myhead></myhead>
                </div>
            <div class="main-body">
                <div>
                     <navbar></navbar>
                    <!-- <div class="body-left">
                        <a href="javascript:void(0)" onclick="history.go(-1)" style="text-decoration:none">
                            <i class="iconfont icon-arrow-left-s-line"></i>
                        </a>
                    </div>
                    <div class="body-center">
                        <div class="nav">
                            <i class="iconfont icon-tubiaoyuandian-lanse" style="font-size: 12px; color: #409EFF"></i>
                            <font style="font-size: 12px;padding-left:10px;">首页</font>
                        </div>
                    </div>
                    <div class="body-right">
                        <a href="javascript:void(0)" onclick="history.go(+1)" style="text-decoration:none">
                            <i class="iconfont icon-arrow-right-s-line"></i>
                        </a>
                    </div> -->
                </div>
                <div class="main-content">
                    <router-view></router-view>
                </div>
            </div>
        </div>

    </div>
</template>

<script>
import mymenu from "@/components/layout/menu.vue"
import navbar from '@/components/layout/navbar.vue'
import myhead from "@/components/layout/head.vue"
export default {
    data: () => {
        return {
        }
    },
    methods: {
       
    },
    components: {
        mymenu,
        navbar,
        myhead
    },mounted:function(){

    }

}
</script>
<style>
body {
    margin: 0;
    padding: 0;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}

.left {
    height: 100vh;
    background-color: #001529;
}



.left-menu {
    height: calc(100vh - 61px);
    border-right: 1px solid rgb(212 212 216);
}

.main {
    flex: 1;
    width: calc(100vw - 200px);
    height: 100vh;
    background: #000;
}



.head {
    height: 60px;
    width: calc(100vw - 200px);
    background: #000;

}




.main-content {
    background-color: rgb(245, 247, 248);
    width: auto;
    height: calc(100vh - 50px - 60px);
    padding: 8px;
}

.el-menu {
    border-right: solid 0px #e6e6e6;
    list-style: none;
    position: relative;
    margin: 0;
    padding-left: 0;
    background-color: #FFF;
}
</style>